<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<title>{{ config.APP_NAME }}</title>
	<link rel="icon" href="{{ url_for("static", filename="images/logo/logo.png") }}">
	<link href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet">

	<style>
		body {
			margin: 0;
			padding: 0;
			background-color: #f5f5f5;
		}

		hr {
			border-color: #cccccc;
			margin: 0;
		}

		form {
			-webkit-border-radius: 2px;
			-moz-border-radius: 2px;
			border-radius: 2px;
			background-color: #fff;
			-webkit-box-shadow: 0 1px 6px #c0c0c0;
			-moz-box-shadow: 0 1px 6px #c0c0c0;
			box-shadow: 0 1px 6px #c0c0c0;
			padding: 2rem;
			box-sizing: border-box;
		}

		.alert,
		.btn,
		.form-control {
			border-radius: 2px;
		}

		.no-margins {
			margin: 0px;
		}

		.with-margins {
			margin: 10px;
		}

		.with-paddings {
			padding: 10px;
		}

		.col-centered {
			float: none;
			margin: 0 auto;
		}

		#header-div {
			color: #fff;
			background-color: #398dee;
			line-height: 40px;
		}

		#header-div a {
			color: #fff;
		}

		#menu-div {
			color: #666;
			background-color: #fff;
		}

		#menu-div a {
			color: #666;
			display: inline-block;
			padding: 0.5rem 1rem;
		}

		#menu-div a:hover {
			color: #fff;
			background-color: #3cb8f0;
			text-decoration: none;
		}

		#main-div .wrapper:nth-child(2n + 1) {
			background-color: #fff;
		}

		#main-div .wrapper .container > div {
			padding: 2rem;
		}

		#main-div .wrapper .container > div:first-child {
			text-align: right;
		}

		#footer-div {
			color: #999;
			background-color: #eee;
			font-size: 12px;
		}

		#footer-div a {
			color: #999;
		}

	</style>
</head>


<body>
{% block body %}
	<div id="header-div" class="clearfix with-paddings">
		<div class="pull-left">
			<a href="/">
				<img src="/static/images/logo/logo-white.png" height="16"/>
				{#                <h1 class="no-margins">{{ config.APP_NAME }}</h1>#}
			</a>
		</div>
		<div class="pull-right">
			{% if call_or_get(current_user.is_authenticated) %}
				<a href="{{ url_for('noteBoard') }}">进入网页版</a>
				&nbsp; | &nbsp;
				<a href="{{ url_for('user.logout') }}">退出</a>
			{% else %}
				<a href="{{ url_for('user.login') }}">登录</a> /
				<a href="{{ url_for('user.register') }}">注册</a>
			{% endif %}
		</div>
	</div>
	{#	{% block menu %}#}
	{#		<div id="menu-div" class="with-paddings">#}
	{#			<a href="/">首页</a>#}
	{#			{% if call_or_get(current_user.is_authenticated) %}#}
	{#				&nbsp; | &nbsp; <a href="{{ url_for('noteBoard') }}#/setting/profile">个人信息</a>#}
	{#			{% endif %}#}
	{#		</div>#}
	{#	{% endblock %}#}
	<hr class="no-margins"/>

	<div id="main-div">
		{# One-time system messages called Flash messages #}
		{% block flash_messages %}
			{%- with messages = get_flashed_messages(with_categories=true) -%}
				{% if messages %}
					{% for category, message in messages %}
						{% if category=='error' %}
							{% set category='danger' %}
						{% endif %}
						<div class="alert alert-{{ category }}">{{ message|safe }}</div>
					{% endfor %}
				{% endif %}
			{%- endwith %}
		{% endblock %}

		{% block main %}{% block content %}{% endblock %}{% endblock %}
	</div>
	<hr class="no-margins"/>
	<div id="footer-div" class="clearfix">
		<div style="background-color: #fff; color: #666">
			<div class="container">
				<div class="col-sm-2 with-paddings">
					<div>WNote</div>
					<ul>

					</ul>
				</div>
				<div class="col-sm-2 with-paddings">
					<div>Team</div>
					<ul>

					</ul>
				</div>
				<div class="col-sm-2 with-paddings">
					<div>Help</div>
					<ul>

					</ul>
				</div>
				<div class="col-sm-2 with-paddings">
					<div>Community</div>
					<ul>

					</ul>
				</div>
			</div>
		</div>
		<div class="with-paddings" style="width: 100%; display: inline-block;float: left;">
			<div class="pull-left">
				<a href="/legal.html" style="padding: 0.5rem">法律条款</a> |
				<a href="/privacy.html" style="padding: 0.5rem">隐私</a> |
				<a href="/security.html" style="padding: 0.5rem">安全性</a> |
				<a href="/about.html" style="padding: 0.5rem">关于我们</a>
			</div>
			<div class="pull-right">&copy; 2016 {{ config.APP_NAME }}</div>
		</div>
	</div>
{% endblock %}


<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
<!-- Bootstrap -->
<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
</body>
</html>